草庐IT

css - 使 div 可滚动

全部标签

javascript - d3 图表显示在 bootstrap div 之外

我遇到了一个问题,即在d3中,每个选择器选择的条形图都在div区域之外生成。varsvg=d3.select("#barchart").append("svg").attr("width",width+margin.left+margin.right).attr("height",height+margin.top+margin.bottom).append("g").attr("transform","translate("+margin.left+","+margin.top+")");可以在下面的jsbin位置找到完整的代码http://jsbin.com/sodivamiqa/

javascript - 如何设计一个监听 WebSocket 并与 CSS 动画交互的 ReactJS 组件

ReactJS组件需要监听WebSocket发出的事件。对于每个入站事件,组件应该呈现一个DOM节点。然后它应该等待与DOM节点关联的CSS动画完成,然后删除DOM节点。这是我打算实现的草图。这种方法看起来可行吗?setTimeout感觉很糟糕。classMyComponentextendsReact.PureComponent{componentDidMount(){this.props.webSocket.on('myEvent',componentDidReceiveEvent)}componentWillUnmount(){this.props.webSocket.off('m

javascript - 是否可以让 Chrome 返回 CSS "content"属性的原始值?

考虑以下JavaScript、CSS和HTML代码:console.log(getComputedStyle(document.querySelector('p'),'::after').getPropertyValue('content'));p::after{content:"Hello"attr(data-after);}Firefox和IE11都返回CSS中定义的原始值:"Hello"attr(data-after),这正是我所需要的。但是Chrome返回"HelloWorld",解析后的值。当我使用ChromeDevTools检查元素时,我可以看到它在“样式”面板中显示以下信

javascript - 在滚动事件上监听的函数中未更新 React Hook

我有一个函数handleScroll,它在滚动事件上被监听。此函数必须更新isFetching(开始时为false,并且必须更改bool值)。函数handleScroll被正确监听,如console.log所示。但是,isFetching始终为false。似乎从未读取过setIsFetching。我认为,另一种选择类似于eventListener卡住handleScroll函数的第一个版本。我该怎么做才能更新该函数中的Hook?这是代码的简化版本和codesandbox:/**/importReact,{useState,useEffect}from"react";importReac

javascript - 如何让页面滚动触发鼠标悬停事件?

当鼠标因滚动(通过滚轮或键盘滚动)而开始悬停在某个元素上时,它不会在悬停的元素上触发鼠标悬停事件(OSX上的Chrome6)。滚动时触发正确元素的鼠标悬停事件的优雅方式是什么? 最佳答案 老实说,这会很痛苦。你必须确定应获得鼠标悬停处理程序的每个元素的大小和位置。向窗口添加滚动监听器。在处理程序中,获取鼠标光标位置和pageOffset。找出光标所在的元素。手动调用实际的鼠标悬停处理程序(找出光标离开了哪些元素,如果你也想要一些mouseout行为)如果元素是动态的,您可能需要重新计算元素的位置和大小。(将1.移到3.下方。)虽然这

javascript - 检测并记录外部 JavaScript 或 CSS 资源无法加载的时间

我有多个对外部js和css资源的引用。大多数情况下,这些用于第三方分析等。有时(传闻)这些资源无法加载,通常会导致浏览器超时。是否可以在外部JavaScript或CSS资源加载失败时检测并登录服务器?我正在考虑某种类型的延迟加载机制,当失败时,将调用一个特殊的URL来记录此失败。有什么建议吗?我认为会发生什么:用户点击我们的页面,服务器端成功处理并提供页面在客户端,HTMLheader尝试连接到我们的第3方集成合作伙伴,通常通过以“http://www.someothercompany.com...”开头的javascript包含。其他公司无法处理我们的负载或正常运行时间很差,因此连接

javascript - CSS 和 JavaScript : Get a list of CSS custom attributes

来自这段代码:HTMLCSS.test{background-color:red;font-size:20px;-custom-data1:value1;-custom-data2:150;-custom-css-information:"loremipsum";}使用javascript——例如从$('.test')——我如何才能得到一个CSS属性列表,其属性名称以前缀“-custom-”开头“?(他们可以有不同的名字,但总是相同的前缀)我想得到这个:{customData1:"value1",customData2:150,customCssInformation:"loremip

javascript - 试图涂黑可移动 div 之外的所有内容

我写了一个悬停缩放插件,我想弄清楚如何将悬停缩放框外的所有东西都变暗,并使缩放框本身透明,但我很难弄清楚我需要什么为它做。我使用不透明度吗?我是否使用背景图片?现在它只是在较暗的黑色不透明度bg之上显示白色0.5不透明度,但我有点挠头试图弄清楚这一点。任何建议都会非常有帮助。我正在尝试做的事情:演示:jsfiddle 最佳答案 这是一个解决方案示例,但它需要您进行一些更改。如果您将缩放方block设置为具有与底层图像相同的背景图像,并通过css将其背景位置调整为其相对于原始图像的位置的负值...我是否正确解释了这一点?http://

javascript - 分离并重新连接鼠标滚轮事件监听器不重置滚动惯性

我正在使用jquery-mousewheel触发功能的插件。当我调用moveit时,我会分离监听器并等待动画完成,然后重新附加监听器。问题是,当我重新附加它时,鼠标滚轮插件仍在监听某些鼠标/触控板的惯性,并反复调用moveit。我想在我的特定情况下,去抖动或限制函数调用不是好的解决方案,因为惯性仍然存在,而且我还希望为其他可能的moveit调用立即附加监听器。有没有办法通过完全重置鼠标滚轮事件来“消除惰性”,而不是仅仅将其分离?$(document).ready(function(){vartween;varslide=$('#slide');functionbodyListen(){

javascript - 如何限制移动网站的滚动但允许访问可能缩回的地址栏

Ihavearepoupandrunningifyou'reinterestedincontributingtosolutions.我在构建移动网站时遇到了一个有趣的问题。我正在设置“溢出:隐藏;”当抽屉被切换时到html/body。这样窗口就无法滚动,并且抽屉-可滚动-在达到其极限时不会滚动页面(e.preventDefault();&e.stopPropagation();千万别耍花招)。这一切都很好。如果这是一个Phonegap应用程序,那就太棒了。但是,由于这是一个网站,不一致的溢出设置会导致浏览器的“全屏模式”出现可用性问题。“全屏模式”是指在向下滚动页面时隐藏地址栏。当向上